class GuaGame {
    static instance(...args) {
        this.i = this.i || new this(...args)
        return this.i
    }
    constructor(fps, images, callback) {
        var self = this
        var keydowns = {}
        window.fps = fps
        this.scenes = {}
        this.scene = null
        this.actions = {}
        this.keydowns = keydowns
        this.images = {}
        this.callback = callback

        this.canvas = document.querySelector('#id-canvas')
        this.context = self.canvas.getContext('2d')

        window.addEventListener('keydown', function(event) {
            self.keydowns[event.key] = "keydown"
        })
        window.addEventListener('keyup', function(event) {
            self.keydowns[event.key] = "keyup"
        })

        self.loadImages(images)
    }

    update() {
        this.scene.update()
    }
    draw() {
        this.scene.draw()
    }
    drawImage(guaImage) {
        this.context.drawImage(guaImage.texture, guaImage.x, guaImage.y)
    }
    registerAction(key, callback) {
        var self = this
        self.actions[key] = callback
    }

    loadImages(images) {
        var self = this
        var loads = []
            // 预先载入所有图片
        var names = Object.keys(images)
        for (let i = 0; i < names.length; i++) {
            let name = names[i]
            const path = images[name]
            let img = new Image()
            img.src = path
            img.onload = function() {
                // 存入 self.images 中
                self.images[name] = img
                    // 所有图片载入成功后，开始运行游戏
                loads.push(1)
                if (loads.length == names.length) {
                    self.run()
                }
            }

        }
    }

    runLoop(self) {
        // events 
        fps = window.fps

        var actions = Object.keys(self.actions)
        for (var i = 0; i < actions.length; i++) {
            var key = actions[i]
            if (self.keydowns[key] == "keydown") {
                // 如果按键被按下, 传递一个 keydown status
                self.actions[key]("keydown")
            } else if (self.keydowns[key] == "keyup") {
                self.actions[key]("keyup")
                self.keydowns[key] = null
            }
        }
        // update 
        self.update()
            // draw
        self.context.clearRect(0, 0, self.canvas.width, self.canvas.height)
        self.draw()

        var runLoop = self.runLoop
        setTimeout(function() {

            runLoop(self)
        }, 1000 / window.fps)
    }

    imageByName(name) {
        var image = this.images[name]
        return image
    }

    textureByName(name) {
        var image = this.images[name]
        return image
    }

    addScene(name, scene) {
        this.scenes[name] = scene
    }
    runWithScene(sceneName) {
        this.scene.changeScene()
        this.scene = this.scenes[sceneName]
    }
    replaceScene(sceneName) {
        this.scene.changeScene()
        this.scene = this.scenes[sceneName]
    }
    run() {
        var self = this
            // 装载图片
        self.callback(self)
        setTimeout(function() {
            self.runLoop(self)
        }, 1000 / window.fps)
    }
}